﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="GoShopping.Login" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <link href="Content/css/bootstrap.min.css" rel="stylesheet" />
    <link href="Content/css/Login.css" rel="stylesheet" />
    <script src="Content/js/vue.js"></script>
    <script src="Content/js/jquery-1.10.2.min.js"></script>
    <!-- 引入样式 -->
   <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"/>
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<body>
    <div id="out">
        <div class="out">
     <div class="out-left">
         <img src="images/banner.92c693b4..jpg" />
     </div>
            <div class="Login">
                <div class="Login-nav">
                    <img src="images/Logo.png" />
                    商城登录
                </div>
               
                <div class="denglu">
                    <h2>登录</h2>
                    <div style="background: #00CBFD; border-radius: 5px; padding: 2px; width: 50px;"></div>

                    
                        <div class="col-12 Login-item">
                            <input v-model="obj.data.count" type="text" class="form-control form-control-lg input" required="required" id="count" placeholder="请输入账号/手机号/QQ号" />
                        </div>
                        <div class="col-12 Login-item">
                            <input v-model="obj.data.pwd"  type="password" class="form-control form-control-lg input" required="required" id="pwd" placeholder="请输入密码~" />
                        </div>
                        <div class="col-12 Login-item" style="text-align: right;">
                            <input class="form-check-input" type="checkbox" value="" required="required" id="RmMe" v-model="isCheck" />
                            <label class="form-check-label" for="invalidCheck">已同意相关协议和隐私政策</label>
                        </div>
                        <div class="col-12 Login-item">
                            <button class="btn" style="width: 100%; background: #00CBFD" @click="LogIn">登录</button>
                        </div>
                        <div class="reset">
                            <a href="Register.aspx">没有账号？注册>></a>
                        </div>
                    
                </div>
                   
            </div>
        </div>
    </div>

</body>
<script src="Content/js/bootstrap.bundle.min.js"></script>
</html>
<script type="module">
    import { sendAjaxLogin } from './Content/js/FactoryLogin.js'
    new Vue({
        el: '#out',
        data: {

            name: 'dsdsd',
            obj: {
                url: 'tools/User.ashx',
                data: {
                    count: '',
                    pwd: '',
                    t: "3",
                }
            },
            session: [],
            isCheck: false
        },
        methods: {
            //存储用户信息，UserID,UserName,UserPwd...
            setSession() {
                sessionStorage.setItem("UserID", this.session[0].UserID)
                sessionStorage.setItem("UserName", this.session[0].UserName);
                sessionStorage.setItem("Pwd", this.session[0].UserPwd);
                sessionStorage.setItem("UserPhone", this.session[0].Phone);
                sessionStorage.setItem("QQ", this.session[0].QQ);
            },
            //登录
            LogIn() {
                if (this.obj.data.count != '' && this.obj.data.pwd != '' && this.isCheck != false) {
                    console.log(this.obj)
                    sendAjaxLogin(this.obj).then(res => {
                        console.log(res)
                        if (res.status != "用户名密码不正确" && res.status != "你已经被拉黑了！") {
                            this.session = res.res
                            this.setSession()
                            //跳转页面
                            window.location.href = 'Index.aspx'
                        } else {
                            this.$message({
                                message: res.status,
                                type: 'warning'
                            });
                        }

                    })
                } else {
                    this.$message({
                        message: '请输入完整信息~',
                        type: 'warning'
                    });
                }
            }
        }
    })
</script>
